import "@wangeditor/editor/dist/css/style.css";
import { createEditor, createToolbar } from "@wangeditor/editor";
import { baseURL } from "@/tools/axios-http.js";

class Editor {
    //成员变量声明
    content = [];//富文本编辑器输入的内容
    editorConfig = null;//富文本编辑器的配置
    editor = null;//富文本编辑器的工具栏
    toolbar = null;//富文本编辑器的编辑区域

   

    init(){
        //富文本编辑器初始化
        this.initEditorConfig();
        this.initEditor();
        this.initToolBar();
    }

    
//
initAll(strContent) {
    this.content = strContent;
    this.initEditorConfig();
    this.initEditor();
    this.initToolBar();
}

    

    //该函数用于初始化富文本，但不是初始化工具栏
    initContent(strContent,disable){
        //传入笔记内容，直接赋值到该类的content成员变量上
        this.content = strContent;
        //富文本编辑器初始化
        this.initEditorConfig();
        this.initEditor();
        //编辑内容是否显示光标（是否可以编辑）
        //禁用富文本区域的编辑功能
        if(disable){          
            this.editor.disable();
        }
    }



    //初始化编辑器配置
    initEditorConfig() {
        //this绑定默认是当前对象，为防止this绑定丢失，给this重新赋值了
        var that  = this
        that.editorConfig = {
            placeholder: "请输入笔记内容",
            scroll: false, // 禁止编辑器滚动
            onChange(editor) {
                //是文章JSON数组格式的文本
                that.content = editor.children;
            },
            MENU_CONF: {
                uploadImage: {
                    server: baseURL + "/api/upload",
                    fieldName: "file",
                    customInsert(response, insertFn) {
                        if (response.code == 200) {
                            //图片插入函数
                            insertFn(response.data, "", "");
                        } else {
                            alert("图片上传失败");
                        }
                    },
                },
            },
        };
    }


    //创建文本编辑区editor
    initEditor() {
        //该变量用于初始化富文本的初始内容
        let editorContent = [];
        //判断content（数组）变量是否为空
        if(this.content.length != 0){
            //字符串转换为JSON对象
            editorContent = JSON.parse(this.content)
        }

        this.editor = createEditor({
            selector: "#editor-container",//把id=editor-container的HTML元素作为工具
            content: editorContent,//编辑区域的默认内容
            config: this.editorConfig,//传入编辑区的位置
        });
    }

    // 工具栏
    initToolBar() {
        this.toolbar = createToolbar({
            editor:this.editor,//需要传入编辑器变量
            selector: "#editor-toolbar",
            config: {//排除全屏按钮
                excludeKeys: "fullScreen",
            },
        });
    }

    //从富文本内容中读取笔记简介部分：默认把内容第一段作为简介部分
    getNoteIntro(){
        return this.content[0].children[0].text;
    }

    getNoteContent(){
        //把JSON对象转换成字符串
        return JSON.stringify(this.content);
    }

}


export default Editor;